.flex {
  display: flex;
}
.move {
  transition: all 0.6s;
}
.setfontsize(@computed) {
  font-size: @computed / @basesize;
}
.setheight(@heigiht) {
  height: @heigiht / @basesize;
}
.setwidth(@width) {
  width: @width / @basesize;
}
.box-sizing {
  box-sizing: border-box;
}
.hover {
  &:hover {
    background-color: #2561bc;
  }
}
@basesize: 100rem;
.homePage {
  color: #000;
  .homePageContent {
    .setwidth(1200);
    margin: 0 auto;
    .title_info {
      padding: 60 / @basesize 0 20 / @basesize 0;
      .setfontsize(55);
      font-weight: 800;
    }
    .p_info {
      .setfontsize(22);
      padding-bottom: 30 / @basesize;
    }
    .row_img_info {
      background-color: #f2f2f2;
      .box-sizing;
      padding: 20 / @basesize 5 / @basesize;
      ul {
        .flex;
        li {
          flex: 1;
          margin: 0 1 / @basesize;
          img {
            display: block;
            margin: 0 auto;
            .setwidth(186);
            .setheight(160);
          }
          .p_info {
            padding: 0;
            padding-top: 10 / @basesize;
            .setfontsize(18);
            font-weight: 400;
          }
          h3 {
            .setfontsize(22);
            color: #822e3e;
            padding-top: 10 / @basesize;
          }
        }
      }
    }
    .bg_none {
      background-color: #fff;
    }
    .margin_glup {
      li {
        margin: 0 10 / @basesize;
        img {
          overflow: hidden;
          .setwidth(204);
          .setheight(153);
        }
      }
    }
    .btn {
      margin-top: 40 / @basesize;
      a {
        .setfontsize(20);
        background-color: #8e1028;
        padding: 10 / @basesize 20 / @basesize;
        cursor: pointer;
        display: block;
        width: 92%;
        margin: 20 / @basesize auto;
        &:hover {
          background-color: #003f99;
        }
      }
    }
    .newbtn {
      margin-top: 0;
      margin-bottom: 50 / @basesize;
      a {
        .setheight(50);
        line-height: 50 / @basesize;
      }
    }
    .bggccc {
      background-color: #f7f6f5;
      padding: 10 / @basesize 0;
    }
    .bts {
      .flex;
      a {
        flex: 1;
        margin: 0 20 / @basesize;
        .setfontsize(20);
        font-weight: 800;
      }
      a:nth-child(1) {
        background-color: #81a520;
        .hover;
      }
      a:nth-child(2) {
        background-color: #da7a2c;
        .hover;
      }
      a:nth-child(3) {
        background-color: #bf2a5b;
        .hover;
      }
      a:nth-child(4) {
        background-color: #2561bc;
        .hover;
      }
    }
  }
  .new_info {
    .flex;
    .item_box {
      margin: 0 10 / @basesize;
      flex: 1;
      border: 1px dashed #df6807;
      h3 {
        .setfontsize(22);
        background-color: #df6807;
        color: #fff;
        line-height: 80 / @basesize;
      }
      .p_info_this {
        .setfontsize(20);
        padding: 30 / @basesize;
      }
      .span_size {
        .setfontsize(18);
        color: #fff;
        background-color: #d62c27;
        padding: 10 / @basesize 30 / @basesize;
        display: block;
        .setwidth(200);
        margin: 0 auto;
        margin-bottom: 30 / @basesize;
        .hover;
      }
    }
  }
  .bgc_max {
    background-color: #f7f7f7;
    width: 100%;
    .bgc_set {
      background-color: #f7f7f7;
      overflow: hidden;
      .setwidth(1000);
      margin: 20 / @basesize auto;
      > div {
        float: left;
        background: #8e1028;
        img {
          .setwidth(400);
          .setheight(266);
          transform: translate(-50 / @basesize);
        }
      }
      > ol {
        float: right;
        li {
          .setfontsize(22);
          text-align: left;
          font-weight: 500;
          line-height: 60 / @basesize;
          position: relative;
          span {
            .setwidth(15);
            margin-right: 10 / @basesize;
            .setheight(15);
            display: inline-block;
            background-color: #000;
            border-radius: 50%;
          }
        }
        .btn_this {
          a {
            display: inline-block;
            width: 220 / @basesize;
            line-height: 60 / @basesize;
            background-color: #8e1028;
            color: #000;
            text-align: center;
            color: #fff;
            &:hover {
              background-color: #2561bc;
            }
          }
          a:nth-child(1) {
            margin-right: 70 / @basesize;
          }
        }
      }
    }
  }
  .bgimg {
    .setheight(900);
    .homePageContent {
      height: 100%;
      .title_row_module {
        height: 100%;
      }
    }
    margin-bottom: 50 / @basesize;
    .bgc_set {
      background: none;
      position: relative;
      height: 100%;
      overflow: visible;
      .item {
        border-radius: 20 / @basesize;
        transform: rotate(45deg);
        z-index: 1000;
        position: absolute;
        top: 20 / @basesize;
        .setwidth(150);
        .setheight(150);
        overflow: hidden;
        h4 {
          .setfontsize(20);
          color: #fff;
          transform: rotate(-45deg);
          line-height: 150 / @basesize;
        }
        .solid_down {
          transform: rotate(0deg);
          transform: translate(0px, 150 / @basesize);
          background-color: #fff;
          .setwidth(150);
          .setheight(150);
          .move;
          border-radius: 20 / @basesize;

          > div {
            .move;
            margin: 0 auto;
            transform: rotate(-45deg);
            width: 100%;
            height: 100%;
          }
          i {
            .setfontsize(16);
            display: block;
            font-style: normal;
            line-height: 40 / @basesize;
            cursor: pointer;
            &:hover {
              text-decoration: underline;
            }
          }
        }
        &:hover {
          .solid_down {
            transform: translate(0px, -150 / @basesize);
          }
        }
      }
    }
    background: url(../../assets/bg_02.jpg) center;
  }
}
.solid_bottom {
  h1 {
    border-bottom: 3 / @basesize solid #000;
  }
  .abtns {
    text-align: center;
    overflow: hidden;
    padding: 30 / @basesize 0;
    .item_link {
      line-height: 54 / @basesize;
      .setfontsize(20);
      float: left;
      border-radius: 20 / @basesize;
      .setwidth(270);
      overflow: hidden;
      border: dashed red 1px;
      margin-bottom: 10 / @basesize;
      margin-right: 31 / @basesize;
      &:hover {
        background-color: #8e1028;
        color: #fff;
      }
    }
    .mr-0 {
      margin-right: 0;
    }
  }
}
.school_list_content {
  .bg_none {
    .schoole_list {
      .schoole1f {
        background-color: #f7f7f7;
        overflow: hidden;
        .setheight(160);
        margin-bottom: 20 / @basesize;
        .title {
          > span {
            .setwidth(30);
            margin: 0 auto;
            display: block;
            padding-right: 20 / @basesize;
            font-weight: 800;
            letter-spacing: 4px;
          }
          height: 100%;
          float: left;
          .setwidth(70);
          // 竖排文本
          text-align: center;
          color: #fff;
          writing-mode: tb-rl;
          .setfontsize(24);
          background-color: rgb(228, 161, 89);
        }
        > .float_list {
          height: 100%;
          box-sizing: border-box;
          background-color: #f7f7f7;

          li {
            float: left;
            .setheight(140);
            box-sizing: border-box;
            position: relative;
            overflow: hidden;
            margin: 10 / @basesize;
            > span {
              display: block;
              .setfontsize(18);
            }
            img {
              .setwidth(90);
              .setheight(87);
              display: block;
              margin: 10 / @basesize 29 / @basesize;
            }
            .posibtn {
              .move;
              width: 100%;
              height: 100%;
              position: absolute;
              left: 0;
              top: 140 / @basesize;
              background-color: #e3e3e3;
              > a {
                border-radius: 20 / @basesize;
                width: 90%;
                margin: 0 auto;
                margin-top: 20 / @basesize;
                background-color: #0073a4;
                .setfontsize(16);
                display: block;
                line-height: 40 / @basesize;
                &:hover {
                  text-decoration: underline;
                }
              }
              > a:last-child {
                background-color: #e47100;
              }
            }
            &:hover {
              .posibtn {
                top: 0;
                .move;
              }
            }
          }
        }
      }
      .schoole2f {
        .setheight(306);
        .title {
          background-color: rgb(113, 147, 216);
        }
      }
      .schoole3f {
        .title {
          background-color: rgb(222, 89, 89);
        }
      }
    }
  }
}
